const $ = layui.jquery;
const treeTable = layui.treeTable;
const form = layui.form;
const layer = layui.layer;
$(() => {
    //渲染表格
    treeTable.render({
        elem: '#tbl',
        url: ctx + "/sys/api/v1/category",//向后台提交数据的地址
        method: "get",//默认就是get
        toolbar: "#toolbar",
        defaultToolbar: ['filter', 'exports', 'print'],//右边的按钮
        tree:{
            data: {
                cascade: "none"
            }
        },
        cols: [[
            {type: 'checkbox', fixed: 'left'},
            {field: 'id', title: 'ID', minWidth: 80, sort: true, fixed: "left"},
            {field: 'name', title: '类别名称', minWidth: 280, fixed: "left"},
            {field: 'alias', title: '别名', minWidth: 80},
            {field: 'iconCls', title: '图标', minWidth: 120},
            {field: 'seq', title: '顺序号', minWidth: 80},
            {field: 'parentChain', title: '父类别', minWidth: 160},
            {field: 'description', title: '备注', minWidth: 180},
            {fixed: 'right', title: '操作', templet: '#rowbar', minWidth: 120}
        ]],

    });

    //添加事件，使用on,工具栏事件
    treeTable.on("toolbar(tbl)", function (obj) {
            if (obj.event === "search") {
                reload();
            } else if (obj.event === "del") {//批量删除，安全删除
                let status = treeTable.checkStatus("tbl");
                let checked = status.data;//获取选中的数据
                let ids = [];
                checked.forEach(it => ids.push(it.id));
                if (ids.length === 0) {
                    layer.msg("请选中您要删除的行")
                } else {
                    layer.confirm("是否确认删除选中的行?", function (index) {
                        deleteByIds(ids);
                        reload();
                        layer.close(index);
                    });
                }
            } else if (obj.event === "add") {
                // 获取选中行的类别编号
                let status = treeTable.checkStatus("tbl");
                let checked = status.data;//获取选中的数据
                let parentId =1;
                if(checked.length>1){
                    layer.msg("最多选择一行");
                    return;
                }else if(checked.length===1){
                    parentId = checked[0].id;
                }
                add(parentId);
            } else if (obj.event === "edit") {
                let status = treeTable.checkStatus("tbl");
                let checked = status.data;//获取选中的数据
                if (checked.length === 0) {
                    layer.msg("请选中您要修改的行")
                } else if (checked.length > 1) {
                    layer.msg("一次最多修改一行")
                } else {
                    let cat = checked[0];
                    edit(cat);
                }

            }
        }
    );

//     行工具栏
    treeTable.on("tool(tbl)", function (obj) {
        if (obj.event === "del") {
            let rowData = obj.data;//选中的行的数据
            layer.confirm("是否确认删除选中的行?", function (index) {
                deleteByIds([rowData.id]);
                reload();
                layer.close(index);
            });
        } else if (obj.event === "edit") {
            let cat = obj.data;//选中的行的数据
            edit(cat);
        }

    })

})

// 刷新
function reload() {
    //获取表单数据
    let formData = form.val("search-form");

    //重新加载表格，重新获取数据,where里是传给后台的数据
    treeTable.reload('tbl', {
        where: formData
    });
}

// 删除
function deleteByIds(ids) {
    const url = ctx + "/sys/api/v1/category"
    $.ajax({
        url,
        method: "delete",
        data: {
            ids
        },
        traditional: true,
        success(resp) {//200
            if (resp.success) {
                layer.msg(resp.msg || "删除成功，共删除" + resp.data + "条数据",{icon:1})
            } else {
                layer.msg(resp.msg || "删除失败",{icon:0})
            }
        }, error(resp) {
            console.log(resp)
        }
    })
}

// 增加
function add(parentId) {

    layer.open({
        type: 2,//iframe层
        title: "新增类别",
        area: ['680px', '520px'],
        skin: 'layui-layer-rim', // 加上边框
        content: "/vm/sys/category/add?parentId="+parentId,
        btn: ['确定', '取消'],
        yes: function (index, layero) {
            let iframeWin = layero.find("iframe")[0].contentWindow;
            iframeWin.doSubmit(function (success) {
                if (success) {
                    layer.msg("添加类别成功");
                    layer.close(index);//关闭当前窗口
                    reload();
                } else {
                    layer.alert("添加类别失败", {
                        icon: 2,
                        title: "错误"
                    });
                }
            })
        }
    });
}

// 修改
function edit(cat) {
    layer.open({
        type: 2,//iframe层
        title: "修改类别",
        area: ['680px', '520px'],
        skin: 'layui-layer-rim', // 加上边框
        content: "/vm/sys/category/edit?id=" + cat.id,
        btn: ['确定', '取消'],
        yes: function (index, layero) {
            let iframeWin = layero.find("iframe")[0].contentWindow;
            iframeWin.doSubmit(function (success) {
                if (success) {
                    layer.msg("修改类别成功");
                    layer.close(index);//关闭当前窗口
                    reload();
                } else {
                    layer.alert("修改类别失败", {
                        icon: 2,
                        title: "错误"
                    });
                }
            })
        }
    });
}
